<!DOCTYPE html>
<html>
<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <link href="../style/bootstrap.min.css" rel="stylesheet">
    <link href="../style/animate.min.css" rel="stylesheet">
    <!-- 引入产品样式 -->
    <link href="../style/summernote/summernote-bs3.css" rel="stylesheet">
    <link href="../style/summernote/summernote.css" rel="stylesheet">
    <link href="../style/font-awesome.min.css" rel="stylesheet">
    <link href="../style/style.min.css" rel="stylesheet">
    <link href="../script/fileinput/fileinput.css" rel="stylesheet">
    <link href="../style/style.product.css" rel="stylesheet">
    <script src="../../jquery/dist/jquery.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="../script/product/productManager.js"></script>
    
	<link href="../style/imgcut.css" rel="stylesheet">
    
<style type="text/css">
	
</style>
<script src="../../bootstrap/dist/js/bootstrap.min.js" type="text/javascript"></script>
<script type="text/javascript" charset="utf-8" src="../script/product/summernote.min.js"></script>
<script type="text/javascript" charset="utf-8" src="../script/product/summernote-zh-CN.js"></script>

<script src="../script/layer/layer.min.js"></script>

<script type="text/javascript">
	function uid(){
		return (((1+Math.random())*0x10000)|0).toString(16).substring(1);
	}
	function uuid32(){
		return uid()+uid()+uid()+uid()+uid()+uid()+uid()+uid();
	}
	var beginuuid1 = uuid32();
	
	// 初始化页面信息
	$(function(){
		$("#ROOM_ID").val(beginuuid1);
		$("#ATTR1").attr("name",beginuuid1+"ATTR1");
		//$("#ATTR2").attr("name",beginuuid1+"ATTR2");
		//$("#SUPPLY").attr("name",beginuuid1+"SUPPLY");
		
		// 初始化产品类型
		$("#ship").addClass("active");
		$("#type").val("3");
		
		if($("#DESTINATION1").focus==false){
			$("#coudetail").hide();
		}
		// 初始化潜店信息
		findShop();
		
		findShip();
		// 初始化币种信息
		findCurrency();	
		
		canbuy();
	});
	
	
	 var all="";
	 var allguid="";
	 var guid="";
	 function getDel(k){
		 $(this).parent().remove();  
		 reset();
	 }
	 	 
	 function setholyland(obj){
		$("#DESTINATION3").val(obj.innerHTML);
		$("#holyland_id").val(obj.id);
		$("#holylist").empty();
		$("#TEACHER1").val("");
		$("#TEACHER").val("");
		$("#tealist").empty();
		$("#shopdetail").val("");
		$("#shoplist").val("");
		$("#holydetail").hide();
	}
	 
	// 封装套餐字符串
	function getMeals() {
		var json = '[';
		$('.taocan').each(function() {
			var obj = "{";
			var begintime = $(this).find('tr').eq(0).find('td').eq(0).find('input[type="text"]').val();
			obj += '"begintime":"'  + begintime + '"';
			obj += ",";
			var endtime = $(this).find('tr').eq(0).find('td').eq(1).find('input[type="text"]').val();
			obj += '"endtime":"'  + endtime + '"';
			obj += ",";
			obj += '"rooms":[';
			var trs = $(this).find('tr');
			for(var i = 1 ; i <= trs.length; i++) {
				if(typeof(trs[i]) == 'undefined') continue;
				var attr1 = $(trs[i]).find('td').eq(0).find('input[type="text"]').val();
				attr1 = (attr1 == undefined || attr1 == null ) ? "" : attr1;
				var attr2 = $(trs[i]).find('td').eq(1).find('input[type="text"]').val();
				attr2 = (attr2 == undefined || attr2 == null ) ? "" : attr2;
				var supply = $(trs[i]).find('td').eq(2).find('input[type="text"]').val();
				supply = (supply == undefined || supply == null ) ? "" : supply;
				var rooms = '{';
				rooms += '"attr1":' + '"' + attr1 + '"' +",";
				rooms += '"attr2":' + '"' +attr2 + '"' + ",";
				rooms += '"supply":'  + '"' +supply + '"';
				rooms += '},';
				obj += rooms;
			}
			obj = obj.substring(0,obj.length - 1);
			obj += ']},';
			json += obj;
		});
		json = json.substring(0,json.length - 1);
		json += ']';
		console.log(json);
		return json;
	}
	function getMeals2() {
		var json = '{';
		//var table = $('#taocan1').find('table');
		var rooms = '[';
		var shiptime = '[';
		$('#tctable').find('tr').each(function() {
			var trs = '{';
			var attr1 = $(this).find('td').eq(0).find('input[type="text"]').val();
			var attr2 = $(this).find('td').eq(1).find('input[type="text"]').val();
			var supply = $(this).find('td').eq(2).find('input[type="text"]').val();
			
			trs += '"attr1":' + '"' + attr1 + '"' +",";
			trs += '"attr2":' + '"' +attr2 + '"' + ",";
			trs += '"supply":'  + '"' +supply + '"';
			trs += '},';
			rooms += trs;
			
		});
		if(rooms.length > 1) {
			rooms = rooms.substring(0,rooms.length - 1);
		}
		rooms += ']';
		$('.shiptime').each(function () {
			var shs = '{';
			var beginTime = $(this).find('td').eq(0).find('input[type="text"]').val();
			var endTime = $(this).find('td').eq(1).find('input[type="text"]').val();
				shs += '"begintime":' + '"' + beginTime + '"' +",";
				shs += '"endtime":' + '"' + endTime + '"';
				shs += '},';
				shiptime += shs;
		});
		if(shiptime.length > 1) {
			shiptime = shiptime.substring(0,shiptime.length - 1);
		}
		shiptime += ']';
		json += '"rooms":'+rooms+',"shiptime":'+shiptime+'}';
		return json;
	}
	// 表单提交
	function tijiao(type){
		$("#proStatus").val(type);
		// 获取套餐字符串、包含费用、额外费用
			var taocanJson = getMeals2();
			var incMoney = includeMon('bhfyid');
			var extraMoney = includeMon('ewfyid');
			
			$("#priceUnit").val($("#currency").val());
			$("#mealStr").val(taocanJson);
			$("#includeMoney").val(incMoney);
			$("#extraMoney").val(extraMoney);
			
			$("#payType").val($("input[name='ifshop']:checked").val());
			
			$("#shopName").val($("#shopId").val());
			$("#priceName").val($("#currency").find("option:selected").text());
			$("#shipName").val($("#shipNum").find("option:selected").text());
			// 更换控件,重新赋值
			$("#shopId").val($("#shopId").attr("data-id"));
			//$("#COMODE").val($("#comode option:selected").text());
			
			//$("#NORENT").val($("#norent").val());
			//$("#firstPic").val(allguid);
			//$("#PICTURES").val(guid); 
			
			if($("#ifclau").get(0).checked){
				$("#ifClause").val("Y");
			}
			var reg = /^[0-9]+.?[0-9]*$/;
			var test = $("input[name='detail']").val();
			var country = $("#DESTINATION1").val();
			var dest = $("#DESTINATION2").val();
			var holy = $("#DESTINATION3").val();
			$("#addrDetail").val(country+" "+dest+" "+holy);
			
			if($("#proName").val()==""||$("#proName").val()==null){
				alert("请输入套餐名称");
				$("#proName").focus();
				return false;
			}
			
			if($("#addrDetail").val()==""||$("#addrDetail").val()==null){
				alert("请输入目的地");
				$("#addrDetail").focus();
				return false;
			}
			
			/*if($("#productIntro").val()==""||$("#productIntro").val()==null){
				alert("请输入产品简介");
				$("#productIntro").focus();
				return false;
			}
			
			  if(!reg.test($("#ALLDAYS").val())){ 
				 alert("总天数请输入数字");
				$("#ALLDAYS").focus();
		         return false;  
		     }  

			 if(!reg.test($("#ENTERDAY").val())){ 
				 alert("住宿天数请输入数字");
				 $("#ENTERDAY").focus();
		         return false;  
		     }  
			
			if(!reg.test($("#SWCOUNT").val())){
				alert("潜水次数请输入数字");
				$("#SWCOUNT").focus();
				return false;
			}
		     if(!reg.test($("#ATTR2").val())){
				 alert("套餐价格请输入数字");
				 $("#ATTR2").focus();
				 return false;
			 }
			
			if(!reg.test($("#SUPPLY").val())){
				alert("单房补差请输入数字");
				$("#SUPPLY").focus();
				return false;
			}
			 
			 if(!reg.test($("#comnum").val())){ 
				 alert("佣金请输入数字");
				 $("#comnum").focus();
		         return false;  
		     }  */ 
		     var flag = true;
		     $('#taocan1').find('input[name="ATTR2"]').each(function() {
		    	 var v = $(this).val();
		    	 if(v != '') {
		    		 if(!reg.test(v)){
						 alert("套餐价格请输入合法金额");
						 flag = false;
					 }
		    	 }
		     });
		     $('#taocan1').find('input[name="SUPPLY"]').each(function() {
		    	 var v = $(this).val();
		    	 if(v != '') {
		    		 if(!reg.test(v)){
						 alert("单房补差请输入合法金额");
						 flag = false;
					 }
		    	 }
		     });
		     
		  	// 验证佣金比例百分比 
		  	var com = $("#comnum").val();
		  	if (com != '') {
		  		if ($("#comode").val() == "比例") {
					var re = /^(\d{1,2}(\.\d{1,5})?|100)$/;
					if (!re.test(com)) {
						alert("佣金比例请输入0-100的合法数值");
						flag = false;
					}
				} else if ($("#comode").val() == "金额") {
		    		 if(!reg.test(com)){
						 alert("佣金金额请输入合法金额");
						 flag = false;
					 }
				}
		  	}
		     
		     if(flag) {
				 $("#productForm").submit();
				alert("产品信息已提交,请耐心等待...");
				$("#proSub").attr("disabled","disabled");
		     }
	}
		 
	/* 添加房间 */
	 var deletenum=1;
	 function addRoom(obj,thisuuid){
		 deletenum++;
		 var newuuid = thisuuid;
			  
			var html = document.createElement("input");
			html.type="text";
			html.name=newuuid+"ATTR1";
			html.placeholder="请填写房间类型";
			/* html.setAttribute("class", "DELETE"+deletenum); */
			
			var html1 = document.createElement("input");
			html1.name="ATTR2";
			html1.placeholder="请填写套餐价格";
			html1.type="text";
			/* html1.setAttribute("class", "DELETE"+deletenum); */
			
			var html2 = document.createElement("input");
			html2.name="SUPPLY";
			html2.placeholder="单房补差（￥：元）";
			html2.type="text";
			/* html2.setAttribute("class", "DELETE"+deletenum); */
			/* var html3 = document.createElement("div");
			html3.innerHTML="添加房间";
			html3.setAttribute("class", "divbtn active");
			html3.setAttribute("onclick", "addss1(this,$(this).parentNode().parentNode().parentNode().find('.tongji').val())");
		  */
		    var html3 = document.createElement("div");
			html3.innerHTML="删除房间";
			html3.setAttribute("class", "divbtn active DELETE"+deletenum);
			html3.setAttribute("onclick","delroom(this)");
			
			var row   = document.createElement("tr");
			row.setAttribute("class","DELETE"+deletenum);
			var cell  = document.createElement("td");
			var cell1 = document.createElement("td");
			var cell2 = document.createElement("td");
			var cell3 = document.createElement("td");
			
			row.appendChild(cell);
			row.appendChild(cell1);
			row.appendChild(cell2);
			row.appendChild(cell3); 
			
			cell.appendChild(html);
			cell1.appendChild(html1);
			cell2.appendChild(html2);
			cell3.appendChild(html3); 
			obj.parentNode.parentNode.parentNode.appendChild(row);
	 }
	 
	 /* 添加套餐 */
	var c = 0;
	//$("#addss").click(function(){
	function addShipSet(){
		var uid = uuid32();
		c++;
		var html = document.createElement("input");
		html.name="BEGINTIME";
		html.placeholder="请选择出发日期";
		html.type="text";
		html.setAttribute("class", "Wdate DELETE1");
		html.setAttribute("onFocus", "WdatePicker({onpicking:changeDate,dateFmt:'yyyy-MM-dd'})");
		
		var html1 = document.createElement("input");
		html1.name="ENDTIME";
		html1.placeholder="请选择结束日期";
		html1.type="text";
		html1.setAttribute("class", "Wdate DELETE1");
		html1.setAttribute("onFocus", "WdatePicker({onpicking:changeDate,dateFmt:'yyyy-MM-dd'})");
		
		var html2 = document.createElement("input");
		html2.name="SWCOUNT";
		html2.placeholder="请填写潜水次数";
		html2.type="hidden";
		
		var htmlid = document.createElement("input");
		htmlid.name="ROOM_ID"
		htmlid.type="hidden";
		htmlid.value=uid;
		
		var html3 = document.createElement("input");
		html3.type="text";
		html3.name=uid+"ATTR1";
		html3.placeholder="请填写房间类型";
		
		var html4 = document.createElement("input");
		html4.name="ATTR2";
		html4.placeholder="请填写套餐价格";
		html4.type="text";
		
		var html5 = document.createElement("input");
		html5.name="SUPPLY";
		html5.placeholder="单房补差（￥：元）";
		html5.type="text";
		
		var delhtml = document.createElement("a");
		delhtml.href="javascript:getDel(this)";
		delhtml.innerHTML="删除追加";
		
		var html6 = document.createElement("div");
		html6.innerHTML="添加房间";
		html6.id=uid;
		html6.setAttribute("class", "divbtn active");
		html6.setAttribute("onclick", "addRoom(this,this.id)");
		/* html6.onclick="addss1()";
		html6.class="divbtn active";
		html6.innerText="添加房间"; */
		
		var html7 = document.createElement("div");
		html7.innerHTML = "删除套餐";
		html7.setAttribute("onclick","delplans(this)");
		html7.setAttribute("class","divbtn active DELPLANS"+c);
		
		var newline= document.createElement("br"); 
		var table = document.createElement("table");
		var row   = document.createElement("tr");
		
		var cell  = document.createElement("td");
		//var cell8  = document.createElement("td");
		var cell1 = document.createElement("td");
		var cell2 = document.createElement("td");
		var cellid = document.createElement("td");
		var cell3 = document.createElement("td");
		var delcell = document.createElement("td"); 
		var cell4 = document.createElement("td");
		var cell5 = document.createElement("td");
		var cell6 = document.createElement("td");
		
		document.getElementById("taocan1").appendChild(table);
		
		table.setAttribute("class","taocan DELPLANS"+c);
		
		table.appendChild(row);
		
		row.appendChild(cell);
		//row.appendChild(cell8);
		row.appendChild(cell1);
		row.appendChild(cell2);
		row.appendChild(delcell);
		row.appendChild(cellid);
		
		cell.appendChild(html);
		cell1.appendChild(html1);
		cell2.appendChild(html2);
		cellid.appendChild(htmlid);
		delcell.appendChild(html7);
		var row1 = document.createElement("tr");
	
		document.getElementById("tctable").appendChild(row1);
		
		row1.id="id"+c;
		row1.appendChild(cell3);
		table.appendChild(row1);
		row1.appendChild(cell4);
		row1.appendChild(cell5);
		row1.appendChild(cell6);
		cell3.appendChild(html3);
		cell4.appendChild(html4);
		cell5.appendChild(html5);
		cell6.appendChild(html6);
		

	//	});
	}
	function addShipTime() {
		var html = '<table class="taocan shiptime"><tbody><tr><td><input type="text" id="BEGINTIME" name="BEGINTIME" placeholder="请选择出发日期" onFocus="WdatePicker({onpicking:changeDate,dateFmt:"yyyy-MM-dd"})" class="Wdate DELETE1" ></td><td><input type="text" id="ENDTIME" name="ENDTIME" placeholder="请选择结束日期" onFocus="WdatePicker({onpicking:changeDate,dateFmt:"yyyy-MM-dd"})" class="Wdate DELETE1" ></td><td><div class="divbtn active" onclick="removeShipTime(this)">删除时间</div></td></tr></tbody></table>';
		$('#taocan1').append(html);
		var t = $('#taocan1 table').last();
		$(t).find('input').attr('onFocus',"WdatePicker({onpicking:changeDate,dateFmt:'yyyy-MM-dd'})");
	}
	function removeShipTime(obj) {
		$(obj).parents('table').remove();
	}
</script>

</head>
<body>
<form id="productForm" action="/diving-back/product/productSave.do" method="post">
<div id="addlist">
    <div class="add-title">添加船宿产品</div>
        
	<div class="form-line">
		<div class="form-left">产品类型：</div>
		<div class="form-right">
			<div class="leixing">
				<div id="taocan" onclick="addMeal()">套餐</div>
				<div id="course" onclick="addCourse()">课程</div>
				<div id="fund" onclick="addFun()">欢乐潜</div>
				<div id="ship" onclick="addShip()">船宿</div>
				<div id="trip" onclick="addTravel()">行程</div>
			</div>
		</div>
	</div>
	
	<input type="hidden" id="PROTYPE" name="PROTYPE" value="套餐">
	
	<input type="hidden" id="ifClause" name="ifClause" value="N">
	<input type="hidden" id="country_id" name="country_id">
	<input type="hidden" id="dest_id" name="dest_id">
	<input type="hidden" id="holyland_id" name="holyland_id">
	<input type="hidden" id="addrDetail" name="addrDetail">
	<input type="hidden" id="type" name="type">
	<input type="hidden" id="payType" name="payType">
	<input type="hidden" id="mealStr" name="mealStr">
	<input type="hidden" id="includeMoney" name="includeMoney">
	<input type="hidden" id="extraMoney" name="extraMoney">
	<input type="hidden" id="firstPic" name="firstPic">
	<input type="hidden" id="firstPath" name="firstPath">
	<input type="hidden" id="pictures" name="pictures">
	<input type="hidden" id="proPublish" name="proPublish">
	<input type="hidden" id="priceName" name="priceName">
	<input type="hidden" id="shopName" name="shopName">
	<input type="hidden" id="shipName" name="shipName">
	<input type="hidden" id="proStatus" name="proStatus">
		
	<div class="form-line">
		<div class="form-left">产品名称：</div>
		<div class="form-right">
			<input type="text" id="proName" name="proName" value="">
		</div>
	</div>	
	<div class="form-line">
		<div class="form-left">目的地：</div>
		<div class="form-right mudidi">
			<div>
				<div class="form-left" style="width:10%">国家：</div>
				<div class="form-right">
					<div class="coun">
						<input type="text" id="DESTINATION1" name="DESTINATION1" value="" onclick="findCountry()"/>
						<div id="coudetail" style="display:none;" class="coudetail">
							<ul id="citylist"></ul>
						</div>
					</div>
				</div>
			</div>	
			<div>
				<div class="form-left" style="width:10%;margin-top: 15px">目的地:</div>
				<div class="form-right">
					<div class="coun">
						<input style="margin-top: 15px" type="text" id="DESTINATION2" name="DESTINATION2" value="" onclick="findDesitination()"/>
						<div id="destdetail" style="display:none;" class="coudetail">
							<ul id="destlist"></ul>
						</div>
					</div>
				</div>
			</div>
			
			<div>
				<div class="form-left" style="width:10%;margin-top: 15px">圣地:</div>
				<div class="form-right">
					<div class="coun">
						<input style="margin-top: 15px" type="text" id="DESTINATION3" name="DESTINATION3" value="" onclick="findHolyland()"/>
						<div id="holydetail" style="display:none;" class="coudetail">
							<ul id="holylist">
								
							</ul>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	
	<div class="form-line">
		<div class="form-left">产品发布:</div>
		<div class="form-right">
			<div class="divbtn active" id="yesbuy" onclick="canbuy()">可购买</div>
			<div class="divbtn" id="ohno" onclick="nobuy()">仅发布</div>
		</div>
	</div>
	
	<!-- <div class="form-line">
		<div class="form-left">涉及价格单位：</div>
		<div class="form-right">
			<div id="remb" class="divbtn active" onclick="rmb()">人民币</div>
			<div id="meiyuan" class="divbtn" onclick="meiy()">美元</div>
			<input type="hidden" name="priceUnit" id="priceUnit" value="CNY">
		</div>
	</div> -->
	<div class="form-line">
		<div class="form-left">涉及价格单位：</div>
		<div class="form-right">
			<!-- <div id="meiyuan" class="divbtn" onclick="meiy()">美元</div> -->
			<div class="coun">
				<select id="currency" name="currency">
					<option value="">请选择币种</option>
				</select>
			</div>
			<input type="hidden" name="priceUnit" id="priceUnit">
		</div>
	</div>
	
	<div class="form-line">
		<!-- <div class="form-left">潜店名称：</div>
		<div class="form-right">
			<div class="coun">
				<select id="shopId" name="shopId">
					<option value="">请选择潜店</option>
				</select>
			</div>
		</div> -->
		<div class="form-left">潜店名称：</div>
		<div class="form-right">
           <div class="input-group">
               <input type="text" class="form-control col-sm-6" id="shopId" name="shopId">
               <div class="input-group-btn">
                   <!-- <button type="button" class="btn btn-white dropdown-toggle" data-toggle="dropdown">
                       <span class="caret"></span>
                   </button> -->
                   <ul style="width:600px;" class="dropdown-menu dropdown-menu-right" role="menu">
                   </ul>
               </div>
               <!-- /btn-group -->
           </div>
       </div>
	</div>
	
	<div class="form-line">
		<div class="form-left">船号：</div>
		<div class="form-right">
			<div class="coun">
				<select id="shipNum" name="shipNum">
					<option value="">请选择船号</option>
				</select>
			</div>
		</div>
	</div>
	
	<div class="form-line">
		<div class="form-left">套餐类型：</div>
		<div class="form-right">
			<div id="taocan1">
				<table class="taocan" id="tctable">
					<tbody>
						<!-- <tr>
							<td><input type="text" id="BEGINTIME" name="BEGINTIME" placeholder="请选择出发日期" onFocus="WdatePicker({onpicking:changeDate,dateFmt:'yyyy-MM-dd'})" class="Wdate DELETE1" ></td>
							<td><input type="text" id="ENDTIME" name="ENDTIME" placeholder="请选择结束日期" onFocus="WdatePicker({onpicking:changeDate,dateFmt:'yyyy-MM-dd'})" class="Wdate DELETE1" ></td>
						</tr> -->
						<tr>
							<td><input type="text" class = "DELETE1" name="ATTR1" id="ATTR1" placeholder="请填写房间类型"></td>
							<td><input type="text" class = "DELETE1" name="ATTR2" id="ATTR2" placeholder="请填写套餐价格"></td>
							<td><input type="text" class = "DELETE1" id="SUPPLY" name="SUPPLY" placeholder="单房补差（¥：元）"></td>
							<td><div class="divbtn active" onclick="addRoom(this)">添加房间</div></td>
						</tr>
						
					</tbody>
				</table>
			</div>
			<div class="divbtn active" id="addss" onclick="addShipTime()">添加时间</div>
						
		</div>
	</div>
	
	<input type="hidden" id="payWay" name="payWay" value="全款" >
	<div class="form-line">
		<div class="form-left">付费方式：</div>
		<div class="form-right">
			<div class="fukuan">
				<div class="divbtn active" id="allmon" onclick="hidepay()">全款</div>
				<div class="divbtn" id="parmon" onclick="showpay()">定金</div>
			</div>
			<div class="divpayway" id="divpayway"  style="display:none;">
				<input type="text" name="advance" id="advance" placeholder="请输入定金比例">％
				<DIV style="BORDER-TOP: #00686b 1px dashed; OVERFLOW: hidden; HEIGHT: 1px"></DIV>
				<p><label><input name="ifshop" type="radio" value="尾款到店付"><span class="lbl"></span>尾款到店付</label></p>
				<label><input name="ifshop" type="radio" value="尾款在平台付"><span class="lbl" ></span>尾款在平台付</label>
				<span>(在平台付需提醒用户出发前1个月付清尾款)</span>
			</div>
		</div>
	</div>
	<div class="form-line">
		<div class="form-left">佣金：</div>
		<div class="form-right">
			<select name="comode" id="comode" placeholder="佣金方式">   
		        <option value="金额">金额</option>
		        <option value="比例">比例</option>
		      </select>
		      <input class="m-l-15" type="text" name="comnum" id="comnum" placeholder="填写金额/比例"> 
		</div>
	</div>
	<div class="form-line">
		<div class="form-left">产品简介：</div>
		<div class="form-right">
		   <textarea name="productIntro" id="productIntro"></textarea>
	   	</div>
	</div>
	<div class="form-line">
		<div class="form-left">产品详情：</div>
		<div class="form-right">
			<!-- <script id="DETAIL" name="DETAIL" type="text/plain" style="width:500px;height:480px;" ></script> -->
			<div class="col-md-11">
				<textarea id="editor_id" class="summernote" name="detail" ></textarea>
		   </div>
		</div>
	</div>


<input type="hidden" id="PRNAME" name="PRNAME">
<input type="hidden" id="PTYPE" name="PTYPE">
<input type="hidden" id="PRODUCT_ID" name="PRODUCT_ID">
<div id="jiage">
	<div class="form-line">
		<div class="form-left">价格说明：</div>
		<div class="form-right">
			<div>
				<table class="feiyong" id="jgsm">
					<tbody id="bhfyid">
						<tr>
							<td style="width:120px;">包含费用</td>
							<td><input type="text" id="PRICEDESC1" name="PRICEDESC1" placeholder="请描述该费用项目"></td>
							<!-- <td><input type="text" id="PRICE1" name="PRICE1" placeholder="请填写费用（单位¥：元）"></td> -->
						</tr>
						<tr>
							<td style="width:120px;"></td>
							<td><input type="text" id="PRICEDESC3" name="PRICEDESC3" placeholder="请描述该费用项目"></td>
							<!-- <td><input type="text" id="PRICE3" name="PRICE3" placeholder="请填写费用（单位¥：元）"></td> -->
						</tr>
					</tbody>
				</table>
				<div class="divbtn-weizhi"><div class="divbtn active" id="bh" onclick="bhClick()">添加包含费用</div></div>
			</div>
			<div>
				<table class="feiyong" id="ewfy">
					<tbody id="ewfyid">
						<tr>
							<td style="width:120px;">额外费用</td>
							<td><input type="text" id="PRICEDESC2" name="PRICEDESC2" placeholder="请描述该费用项目"></td>
<!-- 							<td><input type="text" id="PRICE2" name="PRICE2" placeholder="请填写费用（单位¥：元）"></td> -->
						</tr>
						<tr>
							<td style="width:120px;"></td>
							<td><input type="text" id="PRICEDESC4" name="PRICEDESC4" placeholder="请描述该费用项目"></td>
<!-- 							<td><input type="text" id="PRICE4" name="PRICE4" placeholder="请填写费用（单位¥：元）"></td> -->
						</tr>
					</tbody>
				</table>
				<div class="divbtn-weizhi"><div class="divbtn active" id="ew" onclick="ewClick()">添加额外费用</div></div>
			</div>
		</div>
	</div>
</div>


<div class="form-line">
	<div class="form-left">列表页展示：</div>
	<div class="form-right">
		<input type="hidden" id="addimg2" name="addimg" />
			
		<!-- <div class="form-group phoneCSS">
		   <div class="col-md-12" >
			  <input id="files_1" class="file" name="files" multiple type="file" data-min-file-count="1"/>
		   </div>
		</div> -->
		<div class="container">
		    <div class="imageBox">
		        <div class="thumbBox"></div>
		        <div class="spinner" style="display: none">请选择图片</div>
		    </div>
			
		    <div class="action">
		    	<div class="file">
		    		<input type="file" id="file" class="file-input">
		    		<div class="file-btn">请上传图片</div>
		    	</div>
		    	<span id="picturedes"> 提示 : 单击图片删除</span>
		        <input type="button" id="btnCrop" value="上传" class="filebtn cropbtn">
		        <input type="button" id="btnZoomIn" value="+"  class="filebtn cropjia">
		        <input type="button" id="btnZoomOut" value="-"  class="filebtn cropjian">
		    </div>
		    <div class="cropped"></div>
		</div>
	  	<!-- <div class="file-btn">请上传图片</div> -->
	</div>
</div>

<div class="form-line">
	<div class="form-left">轮播图：</div>
	<div class="form-right">
	<!-- 截图图片上传 -->
	    <input type="hidden" id="addimg" name="addimg" />
		<!-- 截图 -->
		<!-- <div class="form-group phoneCSS">
		   <div class="col-md-12" >
			  <input id="files_2" class="file" name="files" multiple type="file" data-min-file-count="1" />
		   </div>
		</div> -->
		<div class="container2">
		    <div class="imageBox2">
		        <div class="thumbBox2"></div>
		        <div class="spinner2" style="display: none">请选择图片</div>
		    </div>
			
		    <div class="action">
		    	<div class="file">
		    		<input type="file" id="file2" class="file-input">
		    		<div class="file-btn">请上传图片</div>
		    	</div>
		    	<span id="picturesdes"> 提示 : 最多上传5张图片,单击图片删除</span>
		        <input type="button" id="btnCrop2" value="上传" class="filebtn cropbtn">
		        <input type="button" id="btnZoomIn2" value="+"  class="filebtn cropjia">
		        <input type="button" id="btnZoomOut2" value="-"  class="filebtn cropjian">
		    </div>
		    <div class="cropped2"></div>
		</div>
	</div>
</div>

	<div class="form-line">
		<div class="form-left">退订说明：</div>
		<div class="form-right">
		   <textarea name="norent" id="norent"></textarea>
	   	</div>
	</div>
	
	<div class="form-line">
		<div class="form-left">推定条款框：</div>
		<div class="form-right">
			<label><input type="checkbox" id="ifclau" name="ifclau"><span class="lbl"></span></label>
		</div>
	</div>
	
	<div class="submite">
		<input type="button" id="proDraft" value="草 稿" onclick="tijiao(-1)"/>
		<input type="button" id="proSub" value="提 交" onclick="tijiao(0)"/>
		<input type="button" id="proCancel" value="返 回" onclick="proCancelBtn('3')"/>
	</div>
</div>
</form>
</body>
<script type="text/javascript" charset="utf-8" src="../script/fileinput/fileinput.min.js"></script>
<script type="text/javascript" charset="utf-8" src="../script/fileinput/fileinput_locale_zh.js"></script>
<script type="text/javascript" src="../script/suggest/bootstrap-suggest.min.js"></script>
<script type="text/javascript" src="../script/cropbox.js"></script>

<!-- 引入my97日期插件 -->
<script type="text/javascript" src="../script/date/WdatePicker.js"></script>

<script type="text/javascript">
$(document).ready(function(){
	$("#editor_id").summernote({lang:"zh-CN",height:300,width:500});
	 
	 $("#files_2").on("fileuploaded", function(event, data, previewId, index) {
		  alert();
	});
	 
});

//点击日期的回调函数
function changeDate(dp){
	var date = dp.cal.getNewDateStr();
};

function initFileControl(id) {
	var ars = ['jpg','png','gif','bmp','jpeg'];
	$("#" + id).fileinput({
		uploadUrl:'/diving-back/api/file/upload.do',
		showUpload : true,//不显示上传按钮
		maxFileSize: 20480,//文件大小限制
		allowedFileExtensions:ars, //文件类型限制
	});
}
// type值为1表示列表页图、2表示轮播页
/* initFileControl('files_1');
initFileControl('files_2'); */

$("#files_1").on("fileuploaded", function(event, data, previewId, index) {
  var resp = data.jqXHR.responseJSON;
  if(resp.code == 200) {
	  $("#firstPic").val(resp.path);
  }else{
	  
  }
});

$("#files_2").on("fileuploaded", function(event, data, previewId, index) {
  var resp = data.jqXHR.responseJSON;
  if(resp.code == 200) {
	  $("#pictures").val(resp.path);
  }else{
	  
  }
});
$(window).load(function () {
	initUploadCtrl("");
	initUploadCtrl(2);
});
function initUploadCtrl(flag) {
	var options =
	{
		thumbBox: '.thumbBox' + flag,
		spinner: '.spinner' + flag,
		imgSrc: '',
	};
	var cropper = $('.imageBox' + flag).cropbox(options);
	
	$('#file' + flag).on('change', function(){
		var reader = new FileReader();
		reader.onload = function(e) {
			options.imgSrc = e.target.result;
			cropper = $('.imageBox' + flag).cropbox(options);
		};
		reader.readAsDataURL(this.files[0]);
		this.files = [];
	});
	$('#btnCrop' + flag).on('click', function(){
		//var addimg = $("#addimg").val();
		var img = cropper.getDataURL();
		
		/* if(addimg == null || addimg == ""){
			addimg+=img;
			$("#addimg").attr("value",addimg);
		}else{
			addimg+="@"+img;
			$("#addimg").attr("value",addimg);
		} */
		if(flag == 2) {
			var picsval = $('#pictures').val();
			if(picsval != '') {
				picsval = picsval.substring(0,picsval.length - 1);
			}
			var pics = picsval.split(',');
			if(pics.length >= 5) {
				alert('最多能上传5张图片');
				return;
			}
		}
		$.ajax({
			type: 'POST',
			url: '/diving-back/api/file/uploadByBase64.do',
			data: {base64 : img},
			success: function(msg){
				if(msg.code != 200) {
					alert(msg.message);
				}else{
					if(flag == '') {
						$('#firstPic').val(msg.id);
						$('#firstPath').val(msg.path);
						$('.cropped' + flag).html('<img src="'+img+'" onclick="pictureDel(this,1)" width="200" height="100">');
					}else{
						$('#pictures').val(msg.id + ',' + $('#pictures').val());
						$('.cropped' + flag).append('<img src="'+img+'" data-id="'+msg.id+'" onclick="pictureDel(this,2)" width="200" height="100">');
					}
				}
			}
		});
		
	});
	$('#btnZoomIn' + flag).on('click', function(){
		cropper.zoomIn();
	});
	$('#btnZoomOut' + flag).on('click', function(){
		cropper.zoomOut();
	});
}
</script>

</html>